<template>
    <div class="container">
      <div>
        <span>签到名称：{{currentSign.title}}</span>
      </div>
      <div style="margin-top: 20px">
        <span>签到描述：{{currentSign.desc}}</span>
      </div>
      <div style="margin-top: 20px">
        <span>签到协议：{{currentSign.protocol}}</span>
        <div style="margin-top: 8px">
          <!--<Radio v-model="currentSign.isProtocol">同意以上签到协议</Radio>-->
          <!--<Checkbox :model.sync="currentSign.isProtocol" >同意以上签到协议</Checkbox>-->
          <input type="checkbox" id="checkbox" v-model="currentSign.isProtocol"><label for="checkbox">同意以上签到协议</label>
        </div>
      </div>
      <div style="margin-top: 20px">
        <span>学号：</span>
        <i-input v-model="user_number" placeholder="请输入学号" style="width: 80%" ></i-input>
      </div>
      <div style="margin-top: 20px">
        <span>密码：</span>
        <i-input v-model="user_psd" placeholder="请输入密码" style="width: 80%" type="password"></i-input>
      </div>
      <div style="margin-top: 20px;display: flex;justify-content: center">
        <i-button type="success" @click="sign()">签到</i-button>
      </div>
      <baidu-map  class="map" @ready="map_handler">
      </baidu-map>
    </div>
</template>

<script>
  import api from '../api/index.js';
    export default {
        name: "qrcodeSign",
      data () {
        return {
          LON:0.01141,//1公里等于多少经度
          LAT:0.00899,//1公里等于多少纬度
          currentLat:null,//当前位置的经度
          currentLon:null,//当前位置的纬度
          user_number:null,//当前用户学号
          user_psd:null,//用户密码
          BMap:{},
          map:{},
          isSign:false,
          currentSign:{
            title:null,
            desc:null,
            start_time:null,
            end_time:null,
            creater:null,
            longitude:null,
            latitude:null,
            class_id:null,
            protocol:null,
            remake:null,
            addRessrange:null,
            isProtocol:false
          }
        };
      },
      mounted() {
          //获取查询参数 user_id和sign_id
        let sign_id = this.$route.query.signID; //根据签到ID获取签到信息
        console.log(sign_id);
        //获取签到信息
        api.getSignByID(sign_id).then(resolve=>{
          if(resolve.status==1){
            console.log(resolve);
            this.currentSign = resolve.data[0];
          }
        })
      },
      methods: {
        //签到
        sign(){
          let nowTime = new Date();
          let endTime  = new Date(this.currentSign.end_time);
          console.log(endTime,nowTime);
          if(endTime>=nowTime){
            if(this.user_number&&this.user_psd){
              let data = {
                user_number:this.user_number,
                password:this.user_psd
              };
              //获取用户信息
              api.login(data).then(res=>{
                if(res.status==1&&res.data[0]){
                  //成功获取到用户信息
                  let user = res.data[0];
                  //判断当前签到是否有班级
                  if(this.currentSign.class_id&&user.fk_classId!==this.currentSign.class_id){
                    //判断用户班级和当前签到班级是否匹配
                    this.$Message.warning('您不能进行签到');
                    return;
                  }else {
                    //符合条件
                    if(this.currentSign.isProtocol){
                      //同意签到协议
                      let lon = parseFloat(this.currentSign.longitude) +this.currentSign.addRessrange*this.LON; //最大经度
                      let lat = parseFloat(this.currentSign.latitude)+this.currentSign.addRessrange*this.LAT;  // 最大纬度
                      if(this.currentLon>lon||this.currentLat>lat){
                        //超出范围
                        this.$Message.warning('您已经超出能够签到的范围');
                        return;
                      }else {
                        //签到
                        console.log(this.currentSign);
                        let data = {
                          sign_id:this.currentSign.sign_id,
                          class_id:this.currentSign.class_id,
                          class_name:null,
                          user_id:user.user_number,
                          user_name:user.name,
                          sign_latitude:this.currentLat,
                          sign_longitude:this.currentLon
                        };
                        api.sign(data).then(resolve=>{
                          if(resolve.status==1){
                            this.$Message.success('签到成功');
                          }else if(resolve.status==0) {
                            this.$Message.error('签到失败');
                          }
                        })
                      }
                    }else {
                      this.$Message.warning('请您同意签到协议才能进行签到');
                      return;
                    }
                  }

                }else {
                  this.$Message.warning('学号和密码不匹配请重新输入');
                }
              })
            }else {
              this.$Message.warning('请同时输入学号以及密码');
            }
          }else {
            this.$Message.warning('当前签到已过期');
          }

        },
        //初始化地图
        map_handler({ BMap, map }) {
          //获取当前位置的经纬度
          this.BMap = BMap;
          this.map = map;
          if (!this.BMap) return false;
          let geolocation = new BMap.Geolocation();
          let _this = this;
          geolocation.getCurrentPosition(function(r) {
            _this.currentLon = r.point.lng; //纬度
            _this.currentLat = r.point.lat; //经度
          })
        },
      }
    }
</script>

<style  scoped>
  .container{
    width: 100%;
    height: 100%;
    padding: 30px 0;
  }
</style>
